import { userProfilesAPI } from "@/request/api.js"
export default {
    // 1.设置命名空间
    namespaced: true,
    // 共享数据
    state: {
        userInfo: {
            // 昵称
            nickName: '',
            // 积分 鸡腿数
            coin: 0,
            // 头像
            headImg: require('@/assets/img/userImg.f8bbec5e.png'),
        },
        // 购物车总数
        cartTotal: 0
    },
    mutations: {
        // 修改是否显示提示框
        changenUserInfo(states, payload) {
            // console.log("修改用户信息");
            states.userInfo = payload.userInfo;
            states.cartTotal = payload.cartTotal;
        },
        initUserInfon(state) {
            // console.log("初始化信息.");
            state.userInfo = {
                // 昵称
                nickName: '',
                // 积分 鸡腿数
                coin: 0,
                // 头像
                headImg: require('@/assets/img/userImg.f8bbec5e.png'),
            },
                state.cartTotal = 0;
        }
    },
    actions: {
        async asyncChangenUserInfo(context) {
            // 请求用户信息
            let user = await userProfilesAPI()
            // console.log('user用户信息：', user.data);

            // 调用mutations更新用户信息
            context.commit('changenUserInfo', user.data)
        }
    }
}
/* 
问题：
1．刷新之后vuex数据还原了.回到了默认状态
    原因：vuex缺点，刷新后，会还原默认状态，数据没有持久化
    持久化：存储在数据库，本地存储

2．登录成功后，手动删除token，切换导航时，登录状态变成了未登录但是用户信息没有还原!!!
        更新登录状态:通过组件重载，App.vue中watch，会让Topbar.vue 重新执行created     
    解决:更新登录状态后，同时更新用户信息。如果未登录，应该将vuex中数据还原  

    2.1 在vuex中增加方法 初始化state数据 initUserInfo
    2.2 更新登录状态后，同时更新用户信息。
            未登录时，调用initUserInfo

    3．手机扫码后，没有更新用户信息
        代码会去到Topbar. vue中的created代码内
        解决:code==0时，调用actions方法更新信息
*/